<template>
	<view>
		<Navbar title="商务合作" />

		<view style="padding: 0 30rpx;">
			<u--form :model="form" ref="uForm" labelWidth="200rpx" labelAlign="left">
				<u-form-item label="合作类型" borderBottom required>
					<view class="item-panel">
						<u-radio-group v-model="form.type" placement="row" :activeColor="mainColor">
							<u-radio :customStyle="{marginRight: '40rpx'}" v-for="(item, index) in cooperaTypeColumns"
								:key="index" :label="item.name" :name="item.key" @change="cooperaTypeChange">
							</u-radio>
						</u-radio-group>
					</view>
				</u-form-item>
				<u-form-item label="联系人姓名" borderBottom required>
					<view class="item-panel">
						<u--input v-model="form.name" placeholder="请输入姓名" maxlength="20" border="none">
						</u--input>
					</view>
				</u-form-item>
				<u-form-item label="联系人手机" borderBottom required>
					<view class="item-panel">
						<u--input v-model="form.mobile" placeholder="请输入手机号" type="number" maxlength="11" border="none">
						</u--input>
					</view>
				</u-form-item>
				<u-form-item label="公司全称" borderBottom required>
					<view class="item-panel">
						<u--input v-model="form.company" placeholder="请输入公司全称" maxlength="30" border="none">
						</u--input>
					</view>
				</u-form-item>
				<u-form-item label="合作意向描述" required>
					<view class="item-panel flex flex-column">
						<p class="font-24 font-color-3 mb-20">欢迎补充描述您当前团队视频，经营状况、合作业务意向相关信息，方便我们更好地与您沟通和合作。</p>
						<u--textarea v-model="form.intention_desc" maxlength="200" placeholder="请填写合作意向描述">
						</u--textarea>
					</view>
				</u-form-item>
			</u--form>
		</view>

		<view class="btn-panel">
			<u-button text="确定" type="primary" :color="mainColor" @click="handleSubmit()"></u-button>
		</view>

	</view>
</template>

<script>
const { environment } = require('@/config/environment.js')
import colorMixins from '@/mixins/colorMixins.js'
import Navbar from '@/components/navbar/navbar.vue'
import { addUserBusinessCoop } from '@/api/index.js'

export default {
  components: { Navbar, },
  mixins: [colorMixins],
  data() {
    return {
      cooperaTypeColumns: [{
        name: '分销',
        key: 1,
      },
      {
        name: '其它',
        key: 2,
      },
      ],
      form: {
        type: 1,
        name: '',
        mobile: '',
        company: '',
        intention_desc: '',
      },
    }
  },
  created() {},
  methods: {
    cooperaTypeChange(n) {
      console.log('radioChange', n)
    },
		
    async handleSubmit() {
		  if (!this.form.name) return uni.$u.toast('请输入姓名')
		  else if (!this.form.mobile) return uni.$u.toast('请输入手机号')
      else if (!this.form.company) return uni.$u.toast('请输入公司全称')
      else if (!this.form.intention_desc) return uni.$u.toast('请输入合作意向描述')
		
		  await addUserBusinessCoop(this.form)
		  uni.$u.toast('提交成功')
		  setTimeout(() => {
		    uni.navigateBack()
		  }, 1500)
    },
		
  }
}
</script>

<style lang="scss" scoped>
	/deep/ .u-form-item__body {
		padding: 30rpx 0;
		flex-direction: column !important;
	}

	/deep/ .u-form-item {
		margin-bottom: 30rpx;
	}

	/deep/ .u-form-item__body__right__content__slot {
		align-items: flex-end;
		flex-direction: column;
	}

	/deep/ .u-textarea {
		background-color: #F1F1F1 !important;
	}


	.item-panel {
		display: flex;
		position: relative;
		width: 100%;
		margin-top: 20rpx;
	}

	.btn-panel {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 40rpx;
		width: 90%;
		margin: 0 auto;

		/deep/ .u-button {
			font-size: 32rpx;
			font-weight: bold;
		}
	}
</style>
